<html>
  <head>
    <link type="text/css" rel="stylesheet" href="/stylesheets/main.css" />
    <title>It's time to duel!</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
  </head>

  <body>
  
  <script language="javascript">
  $(document).ready(function(){
	  $("#chooseLeft").click(function() {
		  //ajax http post
		  alert("I chose the left one");
	  });
	  $("#chooseRight").click(function(){
		  //ajax http post
		  alert("I chose the right one");
	  });
  });
  </script>
  
  <!--  the main duel field -->
  <input type='submit' id="chooseLeft" value="Left is better" />
  <input type='submit' id="chooseRight" value="Right is better" />
  
  <div id="duelleft"></div>
  <div id="duelright"></div>
  <!--  these should be thumbnails? -->
  <div id="contender1"></div>
  <div id="contender2"></div>
  <div id="contender3"></div>
  <div id="contender4"></div>
  
  
  </body>
</html>